﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IBupro.Models.StudentProjectModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	<%:Html.Translate("edit")%>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <script language="javascript" type="text/javascript">
        $(function () {
            $("#tabs-tags").tabs();
            $(".autocomplete").val("");
        });

        $(document).ready(function () {
            var tagstring = "<%:Model.Tags.Replace(", ",",") %>";
            var tags = tagstring.split(",");

            for (i = 0; i < tags.length; i++) {
                
                if ($('input[type=checkbox][value="'+tags[i]+'"]').size() == 0)
                {
                    $('.autocomplete').val( $('.autocomplete').val() + tags[i]+", ");
                    continue;
                }
                
                $('input[type=checkbox][value="' + tags[i] + '"]').attr('checked', true);
            }

        });

        var allVals = [];

        function settag(sender) {

            if ($(sender).attr("checked", false)) {
                if (!($.inArray($(sender).attr("value"), allVals) === -1)) {

                    allVals[jQuery.inArray($(sender).attr("value"), allVals)] = null;
                    for (var key in allVals) {
                        if (allVals[key] != null) {
                            txt += allVals[key] + ",";
                        }

                    }
                    return;
                }

            }

            if ($(sender).attr("checked", true)) {

                if (($.inArray($(sender).attr("value"), allVals) === -1)) {
                    allVals.push($(sender).attr("value"));
                    var txt = "";
                    for (var key in allVals) {
                        if (allVals[key] != null) {
                            txt += allVals[key] + ",";
                        }

                    }
                    return;
                }


            }
        }

        function formSubmit(sender) {
            var txt = "";
            $('input[type=checkbox]').each(function(index){
                if (this.checked)
                    txt+=$(this).attr('value')+",";
            });
            

            $(".autocomplete").val(txt + $(".autocomplete").val());
            return true;
        }
	
	</script>

    <% using (Html.BeginForm()) {%>
        <%: Html.ValidationSummary(true) %>

        <fieldset>         
            <div class="editor-label">
                <%:Html.Translate("name") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.Name) %>
                <%: Html.ValidationMessageFor(model => model.Name) %>
            </div>

            <div class="editor-label">
                <%:Html.Translate("locked") %>

            </div>
            <div class="editor-field">
                <%: Html.CheckBoxFor(model => model.Locked) %>
                <%: Html.ValidationMessageFor(model => model.Locked) %>
            </div>

            <div class="editor-label">
                <%:Html.Translate("shortcut") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.ShortCut) %>
                <%: Html.ValidationMessageFor(model => model.ShortCut) %>
            </div>

             <div class="editor-label">
				<label for="Tags"><%: Html.Translate("tags") %></label>
				<div id="tabs-tags">
				<ul>
					<li><a href="#tabs-1"><%:Html.Translate("languages") %></a></li>
					<li><a href="#tabs-2"><%:Html.Translate("technologies")%></a></li>
					<li><a href="#tabs-3"><%:Html.Translate("os")%></a></li>
				</ul>
				<div id="tabs-1">
				   <input type="checkbox" value="C#" onchange="settag(this)"/> C#
				   <input type="checkbox" value="PHP" onchange="settag(this)"/> PHP
				   <input type="checkbox" value="C++" onchange="settag(this)"/> C++
				   <input type="checkbox" value="Java" onchange="settag(this)"/> Java
				   <input type="checkbox" value="Python" onchange="settag(this)"/> Python
				   <input type="checkbox" value="SQL" onchange="settag(this)"/> SQL
				   <input type="checkbox" value="C" onchange="settag(this)"/> C
				   <input type="checkbox" value="Ruby" onchange="settag(this)"/> Ruby
				   <input type="checkbox" value="Pascal" onchange="settag(this)"/> Pascal

				</div>
				<div id="tabs-2">
				   <input type="checkbox" value="ASP.NET" onchange="settag(this)"/> ASP.NET
				   <input type="checkbox" value="Ruby Rails" onchange="settag(this)"/> Ruby Rails
				   <input type="checkbox" value="JSF" onchange="settag(this)"/> JSF
				   <input type="checkbox" value="Django" onchange="settag(this)"/> Django
				   <input type="checkbox" value="IIS" onchange="settag(this)"/> IIS
				   <input type="checkbox" value="Apache" onchange="settag(this)"/> Apache
				   <input type="checkbox" value="JBoss" onchange="settag(this)"/> JBoss
				   <input type="checkbox" value="EJB" onchange="settag(this)"/> EJB
				</div>
				<div id="tabs-3">
					<input type="checkbox" value="Linux" onchange="settag(this)"/> Linux
					<input type="checkbox" value="Windows" onchange="settag(this)"/> Windows
					<input type="checkbox" value="Unix" onchange="settag(this)"/> Unix
					<input type="checkbox" value="Mac OS" onchange="settag(this)"/> Mac OS
					<input type="checkbox" value="Android" onchange="settag(this)"/> Android
					<input type="checkbox" value="iOS" onchange="settag(this)"/> iOS
				</div>
			</div>
			</div>
			<div class="editor-field">
				<%: Html.TextBoxFor(model => model.Tags, new {@class = "autocomplete" })%>
			</div>

            
            <div class="editor-label">
                <%:Html.Translate("details") %>
            </div>
            <div class="editor-field">
                <%: Html.TextAreaFor(model => model.Detail,10,50,null) %>
                <%: Html.ValidationMessageFor(model => model.Detail) %>
            </div>
            
            <div class="editor-label">
                <%:Html.Translate("details") %>
            </div>
            <div class="editor-field">
                <%: Html.DropDownList("SubjectId",Model.GetSubjectList()) %>
                <%: Html.ValidationMessageFor(model => model.SubjectId) %>
            </div>
            
            <div class="editor-label">
                <%:Html.Translate("memberCount") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.MemberCount) %>
                <%: Html.ValidationMessageFor(model => model.MemberCount) %>
            </div>
            
            <p>
                <input type="submit" value="<%:Html.Translate("save") %>" onclick="formSubmit(this)" />
            </p>
        </fieldset>

         <script type="text/javascript">

             $(function () {
                 $(".autocomplete").autocomplete({
                     source: function (request, response) {
                         $.getJSON("/Tag/List", {
                             term: extractLast(request.term)
                         }, response);
                     },
                     search: function () {
                         // custom minLength
                         var term = extractLast(this.value);
                         if (term.length < 1) {
                             return false;
                         }
                     },
                     focus: function () {
                         // prevent value inserted on focus
                         return false;
                     },
                     select: function (event, ui) {
                         var terms = split(this.value);
                         // remove the current input
                         terms.pop();
                         // add the selected item
                         terms.push(ui.item.value);
                         // add placeholder to get the comma-and-space at the end
                         terms.push("");
                         this.value = terms.join(", ");
                         return false;
                     },
                     selectFirst: function () {
                         // prevent value inserted on focus
                         return true;
                     },
                     change: function (event, ui) {
                         //if the value of the textbox does not match a suggestion, clear its value
                         if ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0) {
                             $(this).val('');
                         }
                     }
                 }).live('keydown', function (e) {
                     var keyCode = e.keyCode || e.which;
                     //if TAB or RETURN is pressed and the text in the textbox does not match a suggestion, set the value of the textbox to the text of the first suggestion
                     if ((keyCode == 9 || keyCode == 13) && ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0)) {
                         $(this).val($(".ui-autocomplete li:visible:first").text());
                     }


                 });
                 function split(val) {
                     return val.split(/,\s*/);
                 }
                 function extractLast(term) {
                     return split(term).pop();
                 }
             });
	</script>

    <% } %>

</asp:Content>

